<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="s"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<link rel="stylesheet" href="<s:url value="/resource/css/jquery/ui-lightness/jquery-ui-1.9.2.custom.css"/>" />

<link rel="stylesheet" href="<s:url value="/resource/css/jqgrid/ui.jqgrid.css"/>" />
<script src="<s:url value="/resource/js/jquery/jquery-1.8.3.js" />" type="text/javascript"></script>
<script src="<s:url value="/resource/js/jquery/jquery-ui-1.9.2.custom.js" />" type="text/javascript"></script>
<script src="<s:url value="/resource/js/jqgrid/grid.locale-en.js" />" type="text/javascript"></script>
<script src="<s:url value="/resource/js/jqgrid/jquery.jqGrid.min.js" />" type="text/javascript"></script>
<style>
.ui-dialog .ui-state-error { padding: .3em; }
</style>
<script type="text/javascript">
function f_cargaDatosModal(indice){
	$.ajax({
		url :'<s:url value="/DiaCampoDetalleDatos"/>',
		dataType: "html",
		type: "POST",
		data : "codigo="+indice,
		error: function(xhr, ajaxOptions, thrownError){
			alert("hubo un error");
		},
		success: function(datos){
			$("#demo").html(datos);
			$("#dialog-form").dialog({		
				bgiframe: true,
				modal: true,
				width: 800,
				height: 450,
				title: "Datos del dia de campo",
				buttons: {
					Aceptar: function() {
							$(this).dialog('close');
					}
				},
				
			});
		}
	});	
}

	$(function() {
	
		jQuery("#grid").jqGrid({
			url : '<s:url value="/DiaCampoGrid"/>',
			datatype : "json",
			colNames : [ 'Codigo','fecha', 'Cantidad personas','Club', 'Precio Total','Estado Aprobado', 'Estado Pagado','Ver detalle' ],
			colModel : [ {name : 'codigo', index : 'codigo', width : 90,align : "center",editable : true,editrules : {required : true},editoptions : {size : 10}}, 
			             {name : 'fecha',index : 'fecha',width : 90,align : "center",editable : true,editrules : {required : true},editoptions : {size : 10}}, 
			             {name : 'cantidadPersonas',index : 'cantidadPersonas',align : "center",width : 100,editable : true,editrules : {required : true},editoptions : {size : 10}}, 
			             {name : 'club.nombre',index : 'club.nombre',width : 100,editable : true,editrules : {required : true},editoptions : {size : 10}}, 
			             {name : 'precioTotal',index : 'precioTotal',align : "center",width : 100,editable : true,editrules : {required : true},editoptions : {size : 10}}, 
			             {name : 'estadoAprobacion',index : 'estadoAprobacion',align : "center",width : 100,editable : true,editrules : {required : true},editoptions : {size : 10}},
			             {name : 'estadoPagado',index : 'estadoPagado',align : "center",width : 100,editable : true,editrules : {required : true},editoptions : {size : 10}} ,
			             {name : 'codigoDetalle',index : 'codigoDetalle',align : "center",width : 100,editable : true,editrules : {required : true},editoptions : {size : 10}}
			             ],
			multiselect : false,rowNum : 10000,ajaxRowOptions : {async : false},
			height : 200,
			autowidth : true,
			rownumbers : false,
			sortname : 'nombre',
			viewrecords : false,
			sortorder : "asc",
			loadComplete : function() {

			},
			caption : "Lista de Dia de campo",
			emptyrecords : "No hay registros que mostrar",
			loadonce : false,
			loadComplete : function() {
				var ids = jQuery("#grid").getDataIDs();
				for ( var i = 0; i < ids.length; i++) {
					var cl = ids[i];
					ne = "<a href='#' id='edit_"+cl+ "' title='Ver detalle' onclick=\"f_cargaDatosModal(\'"+cl+ "\');\" ><img border='0' src=<s:url value='/resource/images/editar.png'/> class='imgButton'/></a>";
					jQuery("#grid").setRowData(ids[i], {
						codigoDetalle : ne
					});
				}
			},
			jsonReader : {
				root : "rows",
				page : "page",
				total : "total",
				records : "records",
				repeatitems : false,
				cell : "cell",
				id : "codigo"
			}
		});
	});
</script>
<fmt:setBundle basename="upc.pilot.resource.messages" var="value" />
</head>
<body>
	<table width="753" border="0" align="center">
		<tr>
			<td>
				<div id="jqgrid">
					<table id="grid"></table>		
					<div id="buttonLibre" align="right">
						<button onclick="f_cerrarCuerpo();"><fmt:message key="button.salir" bundle="${value}"/></button>
					</div>
				</div>
				<div id="dialog-form" style="display:none;">
				<div id="demo"></div>
				</div>
			</td>
		</tr>
	</table>
</body>
</html>